<template>
    <div>
        <div>
            <!-- 初审 -->
            <el-form v-if="data.state == 1" ref="firstTrial" :model="firstTrial" label-width="120px">
                <el-form-item label="机构办审核">
                    <el-select v-model="firstTrial.isOk" placeholder="请选择">
                        <el-option label="同意" value="1"></el-option>
                        <el-option label="不同意" value="0"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="机构办意见">
                    <el-input v-model="firstTrial.opinion" placeholder="请输入机构办意见" style="width: 50%"></el-input>
                </el-form-item>
            </el-form>
            <!-- 中审 -->
            <el-form v-else-if="data.state == 2" ref="inTrial" v-model="inTrial" inline label-width="120px">
                <el-form-item label="机构办审核">
                    <el-select v-model="inTrial.jgOk" placeholder="请选择">
                        <el-option label="同意" value="1"></el-option>
                        <el-option label="不同意" value="0"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="机构办审核人">
                    <el-input v-model="inTrial.people" placeholder="请输入机构办审核人"></el-input>
                </el-form-item>
                <el-form-item label="审核时间">
                    <el-date-picker
                        v-model="inTrial.trialTime"
                        type="date"
                        placeholder="请选择审核时间"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                    ></el-date-picker> </el-form-item
                ><br />
                <el-form-item label="机构办意见">
                    <el-input v-model="inTrial.opinion" placeholder="请输入机构办意见" style="width: 300%"></el-input> </el-form-item
                ><br />
                <el-form-item label="机构办主任意见">
                    <el-select v-model="inTrial.director" placeholder="请选择">
                        <el-option label="同意" value="1"></el-option>
                        <el-option label="不同意" value="0"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <!-- 专家审核 -->
            <el-form v-else-if="data.state == 3" ref="specialist" :model="specialist" label-width="120px">
                <el-form-item label="专家组意见">
                    <el-select v-model="specialist.isOk" placeholder="请选择">
                        <el-option label="同意" value="1"></el-option>
                        <el-option label="不同意" value="0"></el-option>
                    </el-select>
                    <el-button type="primary" icon="el-icon-download" style="margin-left: 50px" @click="downloadSpecialist"
                        >下载专家组资料</el-button
                    >
                </el-form-item>
                <el-form-item label="专家组资料上传">
                    <input type="file" ref="pathClear" @change="specialistUploadFiles" name="file" id="file" style="width: 200px" />
                    <el-button style="margin-left: 10px;" size="small" icon="el-icon-plus" type="success" @click="specialistUpload"
                        >添 加</el-button
                    >
                </el-form-item>
                <el-form-item label="专家组意见总结">
                    <el-input v-model="specialist.summarize" placeholder="请输入专家组意见总结" style="width: 50%"></el-input>
                </el-form-item>
            </el-form>
            <!-- 立项 -->
            <el-form v-else-if="data.state == 4" ref="setProject" :model="setProject" label-width="120px">
                <el-form-item label="立项日期">
                    <el-date-picker
                        v-model="setProject.time"
                        placeholder="请选择立项日期"
                        style="width: 200px"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                    ></el-date-picker>
                </el-form-item>
            </el-form>
            <!-- 伦理审核 -->
            <el-form v-else ref="instructions" :model="instructions" label-width="120px">
                <el-form-item label="伦理批件日期">
                    <el-date-picker
                        v-model="instructions.time"
                        format="yyyy-MM-dd"
                        placeholder="请选择日期"
                        style="width: 200px"
                        value-format="yyyy-MM-dd"
                    ></el-date-picker>
                </el-form-item>
                <el-form-item label="伦理批件">
                    <input type="file" ref="pathClear" @change="lunliUploadFiles" name="file" id="file" style="width: 200px" />
                    <el-button style="margin-left: 10px;" size="small" icon="el-icon-plus" type="success" @click="lunliUpload"
                        >添 加</el-button
                    >
                </el-form-item>
            </el-form>
        </div>
        <!-- 按钮 -->
        <div style="margin: 15px 0 0 35%">
            <!-- <el-button v-if="data.state != 1" type="warning" style="margin-right: 50px" @click="lastStep">上 一 步</el-button> -->
            <el-button type="primary" style="margin-right: 50px" @click="save">保 存</el-button>
            <el-button v-if="data.state == 1" type="primary" style="margin-right: 50px" @click="$emit('specialist')">专家组管理</el-button>
            <el-button v-if="data.state != 5" type="primary" @click="nextStep">进入下一阶段</el-button>
        </div>
    </div>
</template>

<script>
import { changeStateAPI, getProjectAuditAPI, getProjectUpload, getProjectList, getTabListDetailsAPI } from '@/api/backStage.js';
import { mapState } from 'vuex';
export default {
    name: 'Forms',
    props: {
        data: {
            type: Object,
            default: () => {}
        },
        row: {
            type: Object,
            default: false
        }
    },
    data() {
        return {
            form: {},
            firstTrial: {
                // 初审
                isOk: '', // 是否同意
                opinion: '' // 机构办意见
            },
            inTrial: {
                // 中审
                jgOk: '', // 机构办审核
                people: '', // 审核人
                trialTime: null, // 审核时间
                opinion: '', // 机构办意见
                director: '' // 机构办主任意见
            },
            specialist: {
                // 专家审核
                isOk: '', // 专家组意见
                formData: null, // 专家组资料上传
                summarize: '' // 专家组意见总结
            },
            setProject: {
                // 立项
                time: null // 立项日期
            },
            instructions: {
                // 伦理审核
                time: null, // 伦理批件日期
                formData: null // 伦理批件
            },
            file: null,
            haveSpecialistList: []
        };
    },
    // computed: {
    //     ...mapState({
    //         flag: (state) => {
    //             return state.applyFor.listFlag;
    //         },
    //         basicJbxx: (state) => {
    //             return state.applyFor;
    //         }
    //     })
    // },
    mounted() {
        this.getDetailData();
    },
    methods: {
        // 保存
        async save() {
            if (this.data.state == 1) {
                let obj = {
                    jgb: 'null',
                    jgbshzt: this.firstTrial.isOk,
                    jgbshyj: this.firstTrial.opinion,
                    jgbzr: 'null',
                    JGBZRSHZT: 'null',
                    JGBZRSHYJ: 'null',
                    ZJSHZT: 'null',
                    ZJSHYJ: 'null',
                    LLSPSJ: 'null',
                    lxsj: 'null',
                    jgbzryj: 'null',
                    jgbshsj: 'null'
                };
                if (this.firstTrial.isOk != '' && this.firstTrial.opinion != '') {
                    const res = await getProjectAuditAPI({
                        token: this.$store.state.user.token,
                        xmid: localStorage.getItem('changeXmid'),
                        xmzt: '1',
                        Params: obj
                    });
                    if (res.code == 'succ') {
                        this.$message.success('保存成功');
                    } else {
                        this.$message.error(res.message);
                    }
                } else {
                    this.$message.error('请输入相对应信息');
                }
            } else if (this.data.state == 2) {
                let obj = {
                    JGB: this.inTrial.people,
                    JGBSHZT: this.firstTrial.isOk,
                    JGBSHYJ: this.firstTrial.opinion,
                    JGBZR: 'null',
                    JGBZRSHZT: this.inTrial.director,
                    JGBZRSHYJ: this.inTrial.trialTime,
                    ZJSHZT: 'null',
                    ZJSHYJ: 'null',
                    LLSPSJ: 'null',
                    lxsj: 'null',
                    jgbzryj: 'null',
                    jgbshsj: 'null'
                };
                if (this.inTrial.people && this.inTrial.jgOk && this.inTrial.opinion && this.inTrial.director) {
                    const res = await getProjectAuditAPI({
                        token: this.$store.state.user.token,
                        xmid: localStorage.getItem('changeXmid'),
                        xmzt: '2',
                        Params: obj
                    });
                    if (res.code == 'succ') {
                        this.$message.success('保存成功');
                    } else {
                        this.$message.error(res.message);
                    }
                } else {
                    this.$message.error('请输入相对应信息');
                }
            } else if (this.data.state == 3) {
                let obj = {
                    jgb: 'null',
                    jgbshzt: 'null',
                    jgbshyj: 'null',
                    jgbzr: 'null',
                    JGBZRSHZT: 'null',
                    JGBZRSHYJ: 'null',
                    ZJSHZT: this.specialist.isOk,
                    ZJSHYJ: this.specialist.summarize,
                    LLSPSJ: 'null',
                    lxsj: 'null',
                    jgbzryj: 'null',
                    jgbshsj: 'null'
                };
                if (this.specialist.isOk || this.specialist.summarize) {
                    const res = await getProjectAuditAPI({
                        token: this.$store.state.user.token,
                        xmid: localStorage.getItem('changeXmid'),
                        xmzt: '3',
                        Params: obj
                    });
                    if (res.code == 'succ') {
                        this.$message.success('保存成功');
                    } else {
                        this.$message.error(res.message);
                    }
                } else {
                    this.$message.error('请输入相对应信息');
                }
            } else if (this.data.state == 4) {
                let obj = {
                    jgb: 'null',
                    jgbshzt: 'null',
                    jgbshyj: 'null',
                    jgbzr: 'null',
                    JGBZRSHZT: 'null',
                    JGBZRSHYJ: 'null',
                    ZJSHZT: 'null',
                    ZJSHYJ: 'null',
                    LLSPSJ: 'null',
                    lxsj: this.setProject.time,
                    jgbzryj: 'null',
                    jgbshsj: 'null'
                };
                if (this.setProject.time) {
                    const res = await getProjectAuditAPI({
                        token: this.$store.state.user.token,
                        xmid: localStorage.getItem('changeXmid'),
                        xmzt: '4',
                        Params: obj
                    });
                    if (res.code == 'succ') {
                        this.$message.success('保存成功');
                    } else {
                        this.$message.error(res.message);
                    }
                } else {
                    this.$message.error('请输入相对应信息');
                }
            } else {
                let obj = {
                    jgb: 'null',
                    jgbshzt: 'null',
                    jgbshyj: 'null',
                    jgbzr: 'null',
                    JGBZRSHZT: 'null',
                    JGBZRSHYJ: 'null',
                    ZJSHZT: 'null',
                    ZJSHYJ: 'null',
                    LLSPSJ: this.instructions.time,
                    lxsj: 'null',
                    jgbzryj: 'null',
                    jgbshsj: 'null'
                };
                if (this.instructions.time) {
                    const res = await getProjectAuditAPI({
                        token: this.$store.state.user.token,
                        xmid: localStorage.getItem('changeXmid'),
                        xmzt: '5',
                        Params: obj
                    });
                    if (res.code == 'succ') {
                        this.$message.success('保存成功');
                    } else {
                        this.$message.error(res.message);
                    }
                } else {
                    this.$message.error('请输入相对应信息');
                }
            }
        },
        // 获取列表
        async getGcpList() {
            const res = await getProjectList({
                token: this.$store.state.user.token,
                xmid: localStorage.getItem('changeXmid')
            });
            if (res.code == 'succ') {
                this.tableData = res.result;
            }
        },
        // 获取详情
        async getDetailData() {
            const res = await getTabListDetailsAPI({
                token: this.$store.state.user.token,
                xmid: this.row.xmid
            });
            if (res.result[0].SHXX) {
                if (this.data.state == 1) {
                    this.firstTrial.isOk = res.result[0].SHXX.jgbshzt;
                    this.firstTrial.opinion = res.result[0].SHXX.jgbshyj;
                } else if (this.data.state == 2) {
                    this.inTrial.jgOk = res.result[0].SHXX.jgbshzt;
                    this.inTrial.people = res.result[0].SHXX.jgb;
                    this.inTrial.trialTime = res.result[0].SHXX.jgbshsj;
                    this.inTrial.opinion = res.result[0].SHXX.jgbshyj;
                    this.inTrial.director = res.result[0].SHXX.JGBZRSHZT;
                } else if (this.data.state == 3) {
                    this.specialist.isOk = res.result[0].SHXX.ZJZSHZT;
                    this.specialist.summarize = res.result[0].SHXX.ZJZSHYJ;
                } else if (this.data.state == 4) {
                    this.setProject.time = res.result[0].SHXX.lxsj;
                } else if (this.data.state == 5) {
                    this.instructions.time = res.result[0].SHXX.LLSPSJ;
                }
            }
        },
        // 上一步
        async lastStep() {
            if (this.data.state--) {
                this.$emit('lastStepIndex', this.data.state);
                const res = await changeStateAPI({
                    token: this.$store.state.user.token,
                    xmid: localStorage.getItem('changeXmid'),
                    xmzt: this.data.state
                });
            }
        },
        // 下一步
        async nextStep() {
            if (this.data.state == 1) {
                if (this.firstTrial.isOk != '' && this.firstTrial.opinion != '') {
                    if (this.data.state++) {
                        this.$emit('nextStepIndex', this.data.state);
                        const res = await changeStateAPI({
                            token: this.$store.state.user.token,
                            xmid: localStorage.getItem('changeXmid'),
                            xmzt: Number(this.data.state)
                        });
                        if (res.code == 'succ') {
                        }
                    }
                } else {
                    this.$message.error('请输入对应信息');
                }
            } else if (this.data.state == 2) {
                this.getDetailData();
                if (this.inTrial.people && this.inTrial.jgOk && this.inTrial.opinion && this.inTrial.director) {
                    if (this.data.state++) {
                        this.$emit('nextStepIndex', this.data.state);
                        const res = await changeStateAPI({
                            token: this.$store.state.user.token,
                            xmid: localStorage.getItem('changeXmid'),
                            xmzt: Number(this.data.state)
                        });
                        if (res.code == 'succ') {
                        }
                    }
                } else {
                    this.$message.error('请输入对应信息');
                }
            } else if (this.data.state == 3) {
                this.getDetailData();
                if (this.specialist.isOk && this.specialist.summarize) {
                    if (this.data.state++) {
                        this.$emit('nextStepIndex', this.data.state);
                        const res = await changeStateAPI({
                            token: this.$store.state.user.token,
                            xmid: localStorage.getItem('changeXmid'),
                            xmzt: Number(this.data.state)
                        });
                        if (res.code == 'succ') {
                        }
                    }
                } else {
                    this.$message.error('请输入对应信息');
                }
            } else if (this.data.state == 4) {
                this.getDetailData();
                if (this.setProject.time) {
                    if (this.data.state++) {
                        this.$emit('nextStepIndex', this.data.state);
                        const res = await changeStateAPI({
                            token: this.$store.state.user.token,
                            xmid: localStorage.getItem('changeXmid'),
                            xmzt: Number(this.data.state)
                        });
                        if (res.code == 'succ') {
                        }
                    }
                } else {
                    this.$message.error('请输入对应信息');
                }
            }
        },
        // 专家上传内容
        specialistUploadFiles(event) {
            let file = event.target.files[0];
            this.fileInfo = file;
            let size = Math.floor(file.size / 1024); //计算文件的大小
            this.formData = new FormData(); //new一个formData事件
            this.formData.append('file', file); //将file属性添加到formData里
            this.file = file;
            //此时formData就是我们要向后台传的参数了
        },
        // 专家上传
        async specialistUpload() {
            if (this.$refs.pathClear.value == '') {
                this.$message.warning('请选择上传要上传得文件');
            } else {
                let index = this.file.name.lastIndexOf('.');
                let a = this.file.name.substring(index + 1, this.file.name.length);
                if (a != 'xlsx' && a != 'docx' && a != 'doc' && a != 'pdf' && a != 'ppt') {
                    this.$message.warning('目前只支持xlsx以及docx,doc,pdf,ppt类型文档!');
                    this.$refs.pathClear.value = '';
                } else {
                    const res = await getProjectUpload({
                        token: this.$store.state.user.token,
                        oprid: this.$store.state.user.oprid,
                        xmid: localStorage.getItem('changeXmid'),
                        xmjd: '1',
                        ImportImage: this.formData
                    });
                    if (res.code == 'succ') {
                        this.$message.success('上传' + res.message);
                        this.$refs.pathClear.value = '';
                        // 上传成功之后清除input框file的值
                        this.getGcpList();
                    } else {
                        this.$message.error('上传失败');
                        this.$refs.pathClear.value = '';
                    }
                }
            }
        },
        // 伦理上传内容
        lunliUploadFiles(event) {
            let file = event.target.files[0];
            this.fileInfo = file;
            let size = Math.floor(file.size / 1024); //计算文件的大小
            this.formData = new FormData(); //new一个formData事件
            this.formData.append('file', file); //将file属性添加到formData里
            //此时formData就是我们要向后台传的参数了
        },
        // 伦理上传
        async lunliUpload() {
            if (this.$refs.pathClear.value == '') {
                this.$message.warning('请选择上传要上传得文件');
            } else {
                const res = await getProjectUpload({
                    token: this.$store.state.user.token,
                    oprid: this.$store.state.user.oprid,
                    xmid: localStorage.getItem('changeXmid'),
                    xmjd: '2',
                    ImportImage: this.formData
                });

                if (res.code == 'succ') {
                    this.$message.success('上传' + res.message);
                    this.$refs.pathClear.value = '';
                    // 上传成功之后清除input框file的值
                    this.getGcpList();
                } else {
                    this.$message.error('上传失败');
                    this.$refs.pathClear.value = '';
                }
            }
        },
        // 下载专家组资料
        downloadSpecialist() {
            const obj = this.transData(this.haveSpecialistList);
            import('@/vendor/Export2Excel').then(excel => {
                excel.export_json_to_excel({
                    header: obj.header,
                    data: obj.data,
                    filename: '专家组资料',
                    autoWidth: true,
                    bookType: 'xlsx'
                });
            });
        },
        // 处理要导出excel数据
        transData(rows) {
            const map = {
                id: '编号',
                name: '姓名',
                sex: '性别',
                education: '学历',
                phone: '电话',
                major: '专业'
            };
            const enKeys = Object.keys(rows[0]);
            const header = enKeys.map(enKeys => {
                return map[enKeys];
            });
            const data = rows.map(item => {
                return Object.values(item);
            });
            return { header, data };
        }
    }
};
</script>

<style scoped></style>
